import WebVideoCreator, { VIDEO_ENCODER, logger } from "web-video-creator";

async function runHDTest() {
    const wvc = new WebVideoCreator();

    // 配置WVC以获得最佳视频质量
    wvc.config({
        debug: true,
        ffmpegDebug: true,
        frameFormat: "png",          // 无损压缩
        frameQuality: 95,            // 高质量
        browserUseGPU: true,         // GPU加速
        browserUseAngle: true,       // Angle渲染后端
        mp4Encoder: VIDEO_ENCODER.CPU.H264  // 可根据硬件调整
    });

    logger.info("开始高清视频渲染测试...");

    // 创建高清视频
    const video = wvc.createSingleVideo({
        content: `
        <!DOCTYPE html>
        <html>
            <head>
                <meta charset="utf-8" />
                <title>高清测试</title>
                <style>
                    body { 
                        margin: 0; 
                        background: linear-gradient(45deg, #ff6b6b, #4ecdc4);
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        height: 100vh;
                    }
                    svg { filter: drop-shadow(0 0 10px rgba(0,0,0,0.3)); }
                </style>
            </head>
            <body>
                <svg width="400" height="400" viewBox="0 0 400 400">
                    <defs>
                        <linearGradient id="grad" x1="0%" y1="0%" x2="100%" y2="100%">
                            <stop offset="0%" style="stop-color:#ff4757"/>
                            <stop offset="100%" style="stop-color:#3742fa"/>
                        </linearGradient>
                    </defs>
                    <polygon points="200,50 350,350 50,350" 
                             fill="url(#grad)" 
                             stroke="#fff" 
                             stroke-width="5">
                        <animateTransform attributeName="transform" 
                                        type="rotate" 
                                        from="0 200 200" 
                                        to="360 200 200" 
                                        dur="10s" 
                                        repeatCount="indefinite" />
                    </polygon>
                </svg>
            </body>
        </html>
        `,
        
        // 高清设置
        width: 1920,
        height: 1080,
        fps: 60,
        duration: 10000,
        
        // 质量优化
        videoQuality: 100,
        pixelFormat: "rgb24",
        audioBitrate: "320k",
        
        outputPath: "./test-hd-output.mp4",
        showProgress: true,
        consoleLog: true
    });

    // 事件监听
    video.once("completed", result => {
        logger.success(`✅ 高清视频渲染完成！
📹 视频时长: ${Math.floor(result.duration / 1000)}秒
⏱️  渲染耗时: ${Math.floor(result.takes / 1000)}秒
🚀 实时率: ${result.rtf}
📁 输出文件: ./test-hd-output.mp4
📊 分辨率: 1920x1080@60fps`);
    });

    video.once("error", err => {
        logger.error("❌ 渲染失败:", err);
    });

    // 启动渲染
    video.start();
}

// 运行测试
runHDTest().catch(console.error);